<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
        <title>The Lookup</title>
        <link href="public/css/style.css" rel="stylesheet" type="text/css" />
        <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
        <link rel="icon" href="favicon.ico" type="image/x-icon">
    </head>
    <body>
        <div id="wrap">
            <div id="top">
                <h1>CEEBS + High Schools Database Lookup</h1>
            </div>
            <div id="bottom">
                <div class = "side_by_side">
                    <div id="contig_us_map_canvas"></div>
                </div>
                <div class = "side_by_side">
                    <div class="menubar_clicked" id="ceeb_menubar">
                        <div class = "stacked">
                            <p>
                                Enter a CEEB:
                            </p>
                            <input type="checkbox" id="ceeb_select" checked>
                            <p>
                                <input type="text" id="ceeb" placeholder="380000">
                            </p>
                        </div>
                        <div class = "stacked">
                            <div id = "ceeb_display"></div>
                        </div>
                    </div>
                    <div class = "menubar" id="highschool_menubar">
                        <div class = "stacked">
                            <input type="checkbox" id="highschool_select">
                            <p>
                                Enter a High School:
                            </p>
                            <p>
                                <input type="text" id="highSchool" placeholder="South Salem High School">
                            </p>
                        </div>
                        
                        <div class = "stacked">
                            <div id = "highschool_display"></div>
                        </div>
                    </div>
                    <input type="submit" id="lookupButton" value="Lookup">
                </div>
            </div>
            <!--
            The following script tag utilizes RequireJS to perform AMD loading of
            the JavaScript files listed in main.js

            The data-main attribute tells RequireJS which file will be used to
            bootstrap our environment. In this case it will look for main.js
            in the public/js/ directory (the path is relative to the site root).
            -->
            <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
            <script data-main='main' src='public/js/vendor/require.js'></script>
            <!-- JavaScript at the bottom for fast page loading -->
    </body>
</html>
